

/***************************************************身体部分*********************************************************/
#content {
  width:100%;
  background-image: url(../img/fense.jpg);
  background-repeat: no-repeat;
  background-attachment:fixed;
  background-size: cover;
  position: relative;
}
/*三角形布局 女神菜单*/
.trian_textb {
    margin-top: 140px;
    margin-left: -130px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    width: 270px;
}
.trian_texta {
     margin-top: -170px;
     margin-left: -130px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    width: 270px;
}
.triangle1,.triangle3,.triangle5 {
  border-top: 200px solid rgba(111, 201, 123, 1);
  border-left: 120px solid transparent;
  border-right: 120px solid transparent;
  width:0;
  height:0;
}
.triangle2, .triangle4{
    border-left: 120px solid transparent;
    border-right: 120px solid transparent;
    margin-left: -120px;
    border-bottom: 200px solid rgba(211,111,0,0.5);
    width:0;
    height:0;
}
.triangle3, .triangle5 {
    margin-left: -120px;
}
.triangle1 {
  margin-left: 13%;
}

/*游戏图片*/
.wrap img {
  width: 100%;
  height: 300px;
  display: block;
}
/*游戏简介*/
.jinji-text p{
  background: black;
  position: absolute;
  bottom: -150px;
  width: 97%;
  margin: 0;
}
.wrap .box {
  overflow: hidden;
  position: relative;
  color: white;
}
.jinji-text p{
  transition: bottom 1s,opacity 1s;
}
.wrap .box .jinji-text:hover p {
  bottom: 0;
  opacity: 0.7;
}
.wrap a {
  text-decoration: none;
  cursor: pointer;
}
/*游戏大容器*/
.wrap {
  position: relative;
}
.ConsoleGame,.Online,.Web,.Mobile,.Develop {
  float: left;
}
.Online,.Web,.Mobile,.Develop {
  display: none;
}
/*查看更多*/
#btn {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
}
#container {
  position: relative;
  padding-bottom: 100px;
}
/**************屏幕缩小需要改变的样式******************/
@media (max-width: 1199px) {
  .trian_textb {
      margin-top: 100px;
      margin-left: -85px;
      color: white;
      font-weight: bold;
      font-size: 20px;
      width: 160px;
  }
  .trian_texta {
       margin-top: -100px;
       margin-left: -85px;
      color: white;
      font-weight: bold;
      font-size: 20px;
      width: 160px;
  }
  .triangle1,.triangle3,.triangle5 {
    border-top: 160px solid rgba(111, 201, 123, 1);
    border-left: 80px solid transparent;
    border-right: 80px solid transparent;
    width:0;
    height:0;
  }
  .triangle2, .triangle4{
      border-left: 80px solid transparent;
      border-right: 80px solid transparent;
      margin-left: -80px;
      border-bottom: 160px solid rgba(211,111,0,0.5);
      width:0;
      height:0;
  }
  .triangle3, .triangle5 {
      margin-left: -80px;
  }
  .triangle1 {
    margin-left: 17.5%;
  }
  .jinji-text p {
    bottom: -220px;
  }
}
@media (max-width: 991px) {
  .triangle1 {
    margin-left: 8%;
  }
  .jinji-text p{
    bottom: -90px;
    width: 97.8%;
  }
}
@media (max-width: 770px) {
  .trian_textb {
      margin-top: 50px;
      margin-left: -45px;
      color: white;
      font-weight: bold;
      font-size: 10px;
      width: 80px;
  }
  .trian_texta {
       margin-top: -50px;
       margin-left: -45px;
      color: white;
      font-weight: bold;
      font-size: 10px;
      width: 80px;
  }
  .triangle1,.triangle3,.triangle5 {
    border-top: 80px solid rgba(111, 201, 123, 1);
    border-left: 40px solid transparent;
    border-right: 40px solid transparent;
    width:0;
    height:0;
  }
  .triangle2, .triangle4{
      border-left: 40px solid transparent;
      border-right: 40px solid transparent;
      margin-left: -40px;
      border-bottom: 80px solid rgba(211,111,0,0.5);
      width:0;
      height:0;
  }
  .triangle3, .triangle5 {
      margin-left: -40px;
  }
  .triangle1 {
    margin-left: 0;
  }
  .triangleall {
    width: 390px;
    margin: auto;
  }
  .jinji-text p {
    width: 98.8%;
    bottom: 0px;
  }
}
@media (max-width: 430px) {
  .trian_textb {
      margin-top: 50px;
      margin-left: -45px;
      color: white;
      font-weight: bold;
      font-size: 10px;
      width: 80px;
  }
  .trian_textc {
    margin-top: -50px;
  }
  .trian_texta {
       margin-top: -50px;
       margin-left: -45px;
      color: white;
      font-weight: bold;
      font-size: 10px;
      width: 80px;
  }
  .triangle1,.triangle3,.triangle5 {
    border-top: 80px solid rgba(111, 201, 123, 1);
    border-left: 40px solid transparent;
    border-right: 40px solid transparent;
    width:0;
    height:0;
  }
  .triangle2{
      border-left: 40px solid transparent;
      border-right: 40px solid transparent;
      margin-left: -40px;
      border-bottom: 80px solid rgba(211,111,0,0.5);
      width:0;
      height:0;
  }
  .triangle4{
    border-top: 80px solid rgba(111, 201, 123, 1);
    border-left: 40px solid transparent;
    border-right: 40px solid transparent;
    border-bottom: 0px;
    width:0;
    height:0;
  }
  .triangle3, .triangle5 {
      margin-left: -40px;
  }
  .triangle1 {
    margin-left: 0;
  }
  .triangle4 {
    margin-left: 35px;
  }
  .triangleall {
    width: 250px;
    margin: auto;
  }
  .jinji-text p {
    width: 97.8%;
  }
}

/***************************************************游戏详情遮罩部分*********************************************************/
.mask_game {
  position: fixed;
  top: 25%;
  width: 100%;
  color: white;
  font-size: 1em;
  display: none;
}
.mask_body {
  width: 60%;
  display: inline-block;
  vertical-align: middle;
}
.mask_img img{
  width: 100%;
  max-width: 1000px;
  max-height: 500px;
}
/*.left_btn {
  position: fixed;
  left: 0;
  top: 45%;
  font-size: 2em;
}
.right_btn {
  position: fixed;
  right: 0;
  top: 45%;
  font-size: 2em;
}*/
.mask {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: black;
  opacity: 0.5;
  display: none;
}

#mask {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: black;
  opacity: 0.2;
  display: none;
  z-index: 1000;
}

#close {
  position: absolute;
  top: 0;
  right: 30px;
  color: red;
  font-size: 2em;
  cursor: pointer;
}

#ajax {
  margin: auto;
  margin-top: 20px;
  display: none;
  z-index: 20000;
}
